<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/11/6
  Time: 15:55
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
    <script type="text/javascript" src="js/jquery-1.8.2.js"></script>
</head>
<script>
    function changechecked(obj) {
        var tprice=Number($("#toprice").html());
        var xiaoji=Number($("#"+obj.value).html());
            if(obj.checked){
                tprice+=xiaoji;
            }else{
                tprice-=xiaoji;
            }
        $("#toprice").html(tprice);
    }
</script>
<body>

    <center>
        <form action="toPayGoods.do" method="post">
        <table>
            <tr>
                <td>
                    <input type="checkbox"/>
                </td>
                <td>商品编号</td>
                <td>商品名称</td>
                <td>商品价格</td>
                <td>数量</td>
                <td>小计</td>
            </tr>
            <c:forEach var="g" items="${list}">
                <tr>
                    <td>
                        <input type="checkbox" name="gids" value="${g.gid}" checked="checked" onclick="changechecked(this)"/>
                    </td>
                    <td>
                        ${g.gid}
                    </td>
                    <td>${g.gname}</td>
                    <td>${g.gprice}</td>
                    <td>
                        <input type="number" value="${g.count}" min="1" max="${g.gstock}" size="1" onchange="changeprice(this,${g.gid},${g.gprice},${g.gstock})"/>
                    </td>
                    <td>
                        <span name="aa" id="${g.gid}">${g.gprice*g.count}</span>
                    </td>
                </tr>
            </c:forEach>
            <tr align="right">
                <td colspan="100">
                    总价：<a id="toprice"></a>元&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="button" value="去结算" onclick="checkcar()">
                </td>
            </tr>
        </table>
        </form>
    </center>
</body>
<script>
    function checkcar() {
        /**
         * 使用ajax去判断用户有没有登录，登录了，直接把表单提交过去，没有登录，还需要去登录
         */
        $.post(
            "getLoginInfo.do?m="+Math.random(),
            {},
            function (data) {
                if(data=='no'){
                    var flag=null;
                    flag = window.open("login.jsp","","height=400px,width=600px");
                    if(flag!=null){
                        alert("登录成功");
                    }
                }else{
                    document.forms[0].submit();
                }
            }
        );
    }
</script>
<script>
    function changeprice(obj,gid,gprice,gstock) {
        if(obj.value>gstock){
            alert("购买数量超过库存了,您最多只能购买"+gstock+"个了");
        }else{
            /**
             * 当购物车商品数据发生变化的时候，需要做三个事情，
             * 1、改变小计价格
             * 2、改变总价
             * 3、修改cookie里面的商品数量
             * 前两个只是给客户展示的，最后一个才是我们需要的
             */

            /**
             * 修改小计价格
             */

            var to=obj.value*gprice;
            $("#"+gid).text(to);

            /**
             * 修改总价
             */
            var aa = document.getElementsByName("aa");
            var toprice=0;
            for (var i = 0; i <aa.length ; i++) {
                var val=aa[i].innerHTML;
                toprice+=Number(val);
            }
            $("#toprice").text(toprice);


            /**
             * ajax去修改cookie中商品的数量
             */
            $.post(
                "updateCarGoodsCount.do?m="+Math.random(),
                {gid:gid,count:obj.value},
                function (data) {
                    
                }
            );
        }
    }
</script>
<script>
    $(function () {
        var aa = document.getElementsByName("aa");
        var toprice=0;

        for (var i = 0; i <aa.length ; i++) {
            var val=aa[i].innerHTML;
            toprice+=Number(val);
        }

        $("#toprice").text(toprice);
    })
</script>
</html>
